<template>
  <div class="comment">
    <mt-header title="订单编号">
      <div slot="left">
        <mt-button icon="back">返回</mt-button>
      </div>
    </mt-header>
    <div class="detail">
      <div class="info">
        <mt-label>评分</mt-label>
      </div>
      <div class="score">
        <mt-range v-model="rangeValue" barHeight="3">
          <div slot="start">0</div>
          <div slot="end">10</div>
        </mt-range>
      </div>
      <div class="word">
        <mt-field label="订单评价" placeholder="订单评价" type="textarea" rows="4" v-modal="com"></mt-field>
      </div>
    </div>
  </div>
</template>
<style scoped>
  .comment {
    background-color: #fff;
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
  }
  .detail {
    position: absolute;
    top: 10%;
    left: 10%;
    width: 80%;
    height: 90%;
  }
  .info {
    position: absolute;
    top: 10%;
    width: 20%;
    height: 10%;
  }
  .score {
    position: absolute;
    top: 9%;
    left: 20%;
    width: 80%;
    height: 10%;
  }
  .word {
    position: absolute;
    top: 20%;
    width: 100%;
    height: 40%;
  }
</style>
